import React, { Component } from 'react'
import './download.scss'
import { Pagination } from 'antd';
import Header from '../../components/Header/header'
import Footer from '../../components/Footer/footer'  
import { getApiGetDownLists } from "../../axios/api"
import { get } from '../../axios/localstorage';

export default class download extends Component {

    state = {
        banner:[],

        classList:[],

        page:1,
        total:1,

        currentIndex:0,

        typeArr:[],
        type:'',
        time:'',
        price:'',
        format:'',
        timeArr:[],
        priceArr:[],
        formatArr:[],
        second:'',
        third:'',
        secondType:'',
        thirdType:'',

        list:[],
    }

    componentWillMount(){
        this.getLists();
        

        
    }

    componentDidMount(){
        window.scroll(0,0);
    }

    getLists=()=>{

        getApiGetDownLists({
            type:get('type')?get('type'):0,
            content:get('city')?get('city'):get('mechanism'),
            page:this.state.page,
        })
        .then( req =>{
            if(req.data.code === 1){
                let data = req.data.data;
                this.setState({
                    list:data.data,
                    total:data.total
                })
            }
        }).catch( err =>{
            console.error(err);
        })
    }
    

    
    gotoSlide=(num)=>{
        this.refs['bslide'].goTo(num);
    }

    gotoUrl=(item)=>{
        console.log(item);
    }

    onChange=(index)=>{
        this.setState({
            currentIndex:index
        })
    }

    changePage=(page)=>{
        this.setState({
            page
        })

        setTimeout(()=>{
            this.getLists();
        },30)
    }

    gotoCourseInfo=(id)=>{
        this.props.history.push('/activityinfo?id='+id);
    }

    gotoPage=(page)=>{
        this.props.history.push(page);
    }

    

    gotoChooseType=(item)=>{
        this.setState({type:item.id});this.getData();
        if(item.child){
            if(item.child.length > 0){
                this.setState({
                    second:item,
                    third:''
                })
            }else{
                this.setState({
                    second:'',
                    third:''
                })
            }
        }else{
            this.setState({
                second:'',
                third:''
            }) 
        }
    }



    render() {
        return (
            <div className="download">
                <Header />

                <div className='page1' hidden={!get('type')} style={{backgroundImage:"url('assets/img/xiazaibeijing.png')"}}>
                    <div className='pm'>
                        <div className='name'>
                            <img alt="" src="assets/img/xiazaizhuanqu.png" />
                            <h2>下载专区</h2>
                            <p>及时下载，随时查看</p>
                        </div>
                    </div>  
                </div>

                <div className='page1' hidden={get('type')} style={{backgroundImage:"url('assets/img/xaizaizhuanqubeijing.png')"}}>
                    <div className='pm'>
                        <div className='nameBox'>
                            <div className='name2'>
                                <h1>下载专区</h1>
                                <span></span>
                                <div className='imgBox'>
                                    <img alt="" src="assets/img/DownloadZone.png" />
                                </div>
                            </div>
                        </div>
                    </div>  
                </div>

                <div className='page2'>
                    <div className='pm'>
                        <div className='box'>
                            <div className="none" hidden={this.state.list.length !== 0}>
                                <div className="cen">
                                    <img alt="" src="assets/imgs/zanwuxuexineirong.png" />
                                </div>
                                <p>暂无此类课程</p>
                            </div>
                            {
                                this.state.list.map((item,index)=>{
                                    return <div className='item' key={index}>
                                                <div hidden={!get('type')} className='imgBox' style={{backgroundImage:"url('assets/img/wenjian.png')"}}></div>
                                                <div hidden={get('type')} className='imgBox' style={{backgroundImage:"url('assets/img/zhengshu.png')"}}></div>
                                                <h2>{item.title}</h2>
                                                <a className="upload" target="_blank" without rel="noreferrer" href={item.file} name="111" download="附件">
                                                    <img alt="" src="assets/img/xiazai.png"/>
                                                    <h4>下载文件</h4>
                                                </a>
                                            </div>
                                })
                            }
                        </div>
                        <div className='r_page'>
                            <Pagination type="primary" showSizeChanger={false} pageSize={10}  defaultCurrent={this.state.page} total={this.state.total} onChange={(page)=>{this.changePage(page)}} />
                        </div>
                    </div>
                </div>

                <Footer />
            </div>
        )
    }
}
